<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    
    	<link rel="stylesheet" type="text/css" media="all" href="jscalendar-1.0/calendar-win2k-cold-1.css" title="win2k-cold-1" />
<script type="text/javascript" src="jscalendar-1.0/calendar.js"></script>

<script type="text/javascript" src="jscalendar-1.0/lang/calendar-en.js"></script>

<script type="text/javascript" src="jscalendar-1.0/calendar-setup.js"></script>
 
        <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
        <title>Person</title>
    </head>
    <body>
#if($message != $null)
<div class="$message.type.cssClass">$message.text</div>
#end

<form id="signup" action="signup" method="post">
	<table  border="0" cellpadding="3" cellspacing="1" align="center">
                <tr bgcolor="#d0dcff">
                    <td colspan="3">
                        <strong>SignUp</strong>
                    </td>
                </tr>                
                <tr bgcolor="#ffffff">
                    <td>UserName</td>
                    <td colspan="2"><input type="text" name="username" value="$!user.username" tabindex="1" maxlength="20"/>
                    	#springBind("user.username")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>                
                <tr bgcolor="#ffffff">
                    <td>Password</td>
                    <td colspan="2"><input type="password" name="password1" value="" tabindex="1" maxlength="20"/>
                    	#springBind("user.password")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>                
                <tr bgcolor="#ffffff">
                    <td>Confirm Password</td>
                    <td colspan="2"><input type="password" name="password" value="" tabindex="1" maxlength="20"/>
                    </td>
                </tr>
                                
                <tr bgcolor="#ffffff">
                    <td>FirstName</td>
                    <td colspan="2"><input type="text" name="person.firstName" id="firstName" value="$!user.firstName" tabindex="1" maxlength="20"/>
                    	#springBind("person.firstName")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr bgcolor="#ffffff">
                    <td>LastName</td>
                    <td colspan="2"><input type="text" name="person.lastName" id="lastName" value="$!user.lastName" tabindex="2" maxlength="20"/>
                    	#springBind("person.lastName")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr bgcolor="#ffffff">
                    <td>Sex</td>
                    <td colspan="2">
                    	<input type="radio" id="gender" name="person.gender" value="true">Male</input>
                    	<input type="radio" id="gender" name="person.gender" value="false">Female</input>
                    	#springBind("person.gender")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                <tr bgcolor="#ffffff">
					<td>BirthDate :</td>
					<td><input type="text" name="person.birthDate" value="$!person.birthDate" size="20" id="f_date_b" readonly="1"/></td>
					<td><img src="jscalendar-1.0/img.gif" id="f_trigger_b" style="cursor: pointer; border: 1px solid red;" title="Date selector" onmouseover="this.style.background='red';" onmouseout="this.style.background=''" /></td>
				</tr>	
                <tr bgcolor="#ffffff">
                    <td>Status</td>
                    <td>
                    	<select id="status" name="person.status" >
                    		<option value="single">Single</option>
                    		<option value="married">Married to</option>
                    		<option value="inRelation">in RelationShip with</option>
                    	</select>
                    	#springBind("person.status")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                    
                </tr>
                
				<tr bgcolor="#ffffff">
                    <td>Address</td>
                    <td colspan="2">
                    	<input type="text" name="person.address" id="address" value="$!person.address" tabindex="4" maxlength="20"/>
                    	#springBind("person.address")
                    	<font color="red" >#springShowErrors("<br/>" "")</font>
                    </td>
                </tr>
                
                <tr bgcolor="#ffffff">
                    <td colspan="3">
                        <input type="submit" value="Submit"/>
                        <input type="reset" tabindex="21"/>
                    </td>
                </tr>
            </table>
</form>
<script type="text/javascript">
    Calendar.setup({
        inputField     :    "f_date_b",      // id of the input field
        ifFormat       :    "%d/%m/%Y",       // format of the input field
        showsTime      :    true,            // will display a time selector
        button         :    "f_trigger_b",   // trigger for the calendar (button ID)
        singleClick    :    false,           // double-click mode
        step           :    1                // show all years in drop-down boxes (instead of every other year as default)
    });
</script>

        <br/><br/>
            </body>
</html>